<template>
	<view>
		<view style="background: rgb(41, 36, 56);">
			<view class="bargin" v-if="(show==false)">
				<view class="top-sty">
					<view class="user-info">
						<image class="user-img" lazy-load :src="(imgPath)"></image>
						<view class="username">{{user_nickname}}</view>
					</view>
				</view>
				<view class="goods-sty">
					<view class="goods-back-sty">
						<view class="part1_product" v-for="(item,index) in Info.items" :key="index">
							<view>
								<image class="pro_img" lazy-load :src="(item.product_image)"></image>
							</view>
							<view class="pro_info">
								<view class="item_name_sty">{{item.product_item_name}}</view>
								<view class="price_sty">
									<label style="color: #ff6803">{{__('底价：')}}</label>
									<label style="color: #ff6803;font-weight: bold;font-size: 50upx;">{{sprintf('%.2f',item.item_rate_price)}}</label>
									<span style="text-decoration: line-through; margin-left: 10upx; color: #999;">{{item.item_unit_price}}</span>
								</view>
							</view>
						</view>
					</view>
				</view>
				<view class="part-bottom-sty">
					<view class="time_sty">
						<view v-if="(end==2)" class="time_fon_sty">
							{{__('活动时间仅剩')}}
						</view>
						<view v-if="(end==1)">
							<view class="remaining_time">
								<view class="time">{{Time.hour}}</view>
								<view class="point_sty">{{__(':')}}</view>
								<view class="time">{{Time.min}}</view>
								<view class="point_sty">{{__(':')}}</view>
								<view class="time">{{Time.sec}}</view>
							</view>
						</view>
						<view v-if="(end==2)">
							<view class="remaining_time">
								<view class="time">{{Time.hour}}</view>
								<view class="point_sty">{{__(':')}}</view>
								<view class="time">{{Time.min}}</view>
								<view class="point_sty">{{__(':')}}</view>
								<view class="time">{{Time.sec}}</view>
							</view>
						</view>
					</view>
					<view class="u-progressBar">
						<view class="u-progressBar-cont" :style="'width:' + (width) + '%'"></view>
					</view>
					<view class="part3">
						<!-- 还未砍价，发起人=帮砍人，活动正在进行 开始砍价 -->
						<view class="button-start" @click="bargin" v-if="(Info.is_cut==false&&istrue&&end!=1&&end!=3&&Info.order_id=='')"></view>
						<!-- 还未砍价，发起人=帮砍人，活动还未开始 -->
						<view class="button-start" v-if="(Info.is_cut==false&&istrue&&end==1&&Info.order_id=='')"></view>
						<view class="cut_down_sty" v-if="Info.is_cut">
							<view style="margin-left: 150upx;">
								{{__('原价')}}{{__('￥')}}{{sprintf('%.2f',Info.activity_rule_json.cutprice.total_price)}}
							</view>
							<view style="margin-right: 150upx;">
								{{__('已砍')}}{{__('￥')}}{{sprintf('%.2f',Info.activity_rule_json.cutprice.total_price - Info.ac_sale_price)}}
							</view>
						</view>
						<!-- 已经砍价，发起人=帮砍人，活动还未结束，已砍价！=砍价空间 -->
						<view style="display:flex;" v-if="(Info.is_cut&&istrue&&isCut&&end!=1&&end!=3&&Info.order_id=='')">
							<view class="immediately_btn" @click="goshop"></view>
							<view class="help_cut_btn" v-if="(Info.activity_state == 1)" @click='shareBox'></view>
						</view>
						<view style="display:flex;justify-content: space-between">
						</view>

						<!-- 还未砍价，发起人！=帮砍人，活动还未结束 帮忙砍价 -->
						<view class="cut_pri_sty" @click="bargin" v-if="(Info.is_cut==false&&istrue==false&&isCut&&end!=1&&end!=3&&Info.order_id=='')"></view>

						<!-- 已经砍价，发起人=帮砍人，活动还未结束，已砍价=砍价空间 立即出手-->
						<!-- <view class="up_hands_sty" @click="goshop" v-if="(Info.is_cut&&istrue&&isCut==false&&end!=1&&end!=3&&Info.order_id=='')"></view> -->

						<!-- 已经砍价，发起人！=帮砍人，活动还未结束，已砍价！=砍价空间 -->
						<view v-if="(Info.is_cut&&istrue==false&&isCut&&end!=1&&end!=3&&Info.order_id=='')">
							<!-- 我也要 -->
							<navigator :url="'/activity/cutprice/detail?mid=' + (mid) + '&pid=' + (pid) + '&ac_id=' + (ac_id)" class="i_want_sty"></navigator>
							<!-- <button open-type="share" class="button1" style="margin:40upx 0 0 0" @click='shareBox'>{{__('找人帮砍')}}</button>  -->
							<!-- 找人帮砍 -->
							<button class="help_cut_btn_1" v-if="(Info.activity_state == 1)" @click='shareBox'></button>
						</view>
						<!-- 已经砍价，发起人！=帮砍人，活动还未结束，已砍价=砍价空间 我也要 -->
						<navigator :url="'/activity/cutprice/detail?mid=' + (mid) + '&pid=' + (pid) + '&ac_id=' + (ac_id)" v-if="(istrue==false&&isCut==false&&end!=1&&end!=3&&Info.order_id=='')" class="i_want_sty"></navigator>
						<!-- 活动已经结束 再逛逛-->
						<navigator class="again_stroll_sty" url="/activity/cutprice/list" v-if="(end==3)"></navigator>
						<!-- 您已购买，再逛逛 -->
						<navigator class="again_stroll_sty" url="/activity/cutprice/list" v-if="(Info.order_id&&end!=3)"></navigator>
						<!-- 恭喜你，砍价成功 -->
						<view class="congratulate-success" @click="goshop" v-if="(Info.is_cut&&istrue&&isCut==false&&end!=1&&end!=3&&Info.order_id=='')"></view>
					</view>
					<view class="part4" v-if="(Info.Description)">
						<view class="header">{{__('活动说明')}}</view>
						<rich-text :nodes="htmlString"></rich-text>
					</view>

					<view class="part6">
						<scroll-view class="m-nearbylist" scroll-y="true" @scrolltolower="scrollbottom">
							<view v-for="(items, index) in List" :key="index" style="display: flex;position: relative;border-bottom: 1upx solid mediumpurple;">
								<view>
									<image class="avatar_sty" lazy-load :src="(items.user_avatar)"></image>
								</view>
								<view>
									<view class="user_nickname_sty">
										{{items.user_nickname}}<label v-if="items.user_mobile" style="margin-left: 10upx;">{{items.user_mobile}}</label>
									</view>

								</view>
								<view class="cut_away_sty">
									{{__('砍掉')}}{{sprintf('%.2f',items.ach_price)}}{{__('元')}}
								</view>
							</view>
						</scroll-view>
					</view>

				</view>

			</view>
			<view :class="['msk']" @tap="back" v-if="showImg">
				<view class="msk_box">
					<image src="https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/cut-price-animation.png" style='width:100%' mode="widthFix" @tap="back"></image>
				</view>
			</view>

		</view>
		<view class="u-tap-btn">
			<navigator url="/pages/index/index" open-type="switchTab" class="u-go-home">
				<view class="iconfont icon-shouyeshouye"></view>
			</navigator>
		</view>
		<share-box-mp :PageQRCodeInfo="PageQRCodeInfo" @cancelShare="cancelShare" @showCodeImg="showCodeImg" @shareQRCode="shareQRCode" @saveImg="saveImg" :shareDataDefault="shareData" ref="shareBoxMp"></share-box-mp>
		<share-box-app :shareDataDefault="shareData" ref="shareBoxApp"></share-box-app>
		<l-painter useCORS @success="createPoster($event)" isCanvasToTempFilePath ref="painter" path-type="url" custom-style="position: fixed; left: 200%"></l-painter>

	</view>
</template>

<script>
	function getNowFormatDate() {
		var e = new Date,
			t = "-",
			n = e.getMonth() + 1,
			r = e.getDate();
		n >= 1 && n <= 9 && (n = "0" + n), r >= 0 && r <= 9 && (r = "0" + r);
		var i = e.getFullYear() + t + n + t + r;
		return i
	}

	import $ from "../../helpers/util";
	import {
		mapState,
		mapMutations
	} from 'vuex'

	import shareBoxMp from '../../components/share-box-mp.vue'
	import shareBoxApp from '../../components/share-box-app.vue'

	export default {
		data() {
			return {

				Time: "",
				hours: "",
				show: !1,
				showImg: false,
				showPrice: !1,
				isCut: !0,
				imgPath: "",
				user_nickname: "",
				mid: 0,
				uid: 0,
				pid: 0,
				page: 1,
				rows: 10,
				Info: {
					activity_rule: {
						product_image: ''
					}
				},
				end: 0,
				startTime: "",
				endTime: "",
				istrue: !0,
				flag: !0,
				ispage: !0,
				width: 100,
				participantId: "",
				ac_id: 0,
				money: 0,
				List: [],
				hour: 0,
				min: 0,
				sec: 0,
				htmlString: '',
				PageQRCodeInfo: {
					Path: "",
					IsShare: !1,
					IsShareBox: !1,
					IsJT: !1
				},
				shareData: {
					shareText: '随商商城系统，支持原生App、微信小程序，邀请你一起体验！',
					shareTitle: '随商商城系统，支持原生App、微信小程序，邀请你一起体验！',
					href: "https://www.suteshop.com",
					image: ''
				},
				//BEGIN 生成海报参数
				productPoster: '',
				poster: {
					css: {
						width: "750rpx",
						height: '1334rpx',
						background: '#fff'
					},
					views: [{
							type: "image",
							src: "https://kuteshop.oss-accelerate.aliyuncs.com/modulithshop/image/media/plantform/20230915/c9ef027ff64d4cd1b81c7c521f565524.jpg",
							css: {
								left: '0rpx',
								top: '0rpx',
								width: '750rpx',
								height: '1334rpx',
								position: "fixed"
							}
						}, {
							type: "image",
							src: "商品图片",
							css: {
								left: '20rpx',
								top: '20rpx',
								width: '710rpx',
								height: '710rpx',
								position: "fixed"
							}
						},
						{
							type: 'text',
							text: '商品名称',
							css: {
								maxLines: 2,
								lineClamp: 2,
								width: '680rpx',
								left: '35rpx',
								top: '770rpx',
								fontSize: '28rpx',
								color: '#333',
								lineHeight: '50rpx',
								position: "fixed"
							}
						},
						{
							type: 'text',
							text: '¥0',
							css: {
								width: '680rpx',
								left: '35rpx',
								top: '890rpx',
								fontSize: '38rpx',
								color: '#E50F41',
								position: "fixed"
							}
						}, {
							type: "qrcode",
							text: "二维码",
							css: {
								left: '35rpx',
								top: '990rpx',
								width: '260rpx',
								height: '260rpx',
								position: "fixed"
							}
						}, {
							type: 'text',
							text: '长按保存或扫码查看',
							css: {
								position: "fixed",
								left: '60rpx',
								top: '1270rpx',
								fontSize: '20rpx',
								color: '#999'
							}
						}
					]
				},
				//END 商品海报信息

				shareText: '随商商城系统，支持原生App、微信小程序，邀请你一起体验！',
				shareTitle: '随商商城系统，支持原生App、微信小程序，邀请你一起体验！',
				href: "https://www.suteshop.com",
				image: ''
			};
		},
		components: {
			shareBoxMp,
			shareBoxApp
		},
		computed: mapState(['Config', 'StateCode', 'notice', 'plantformInfo', 'shopInfo', 'userInfo', 'hasLogin']),
		onLoad: function(options) {
			uni.setNavigationBarTitle({
				title: this.__('砍价详情')
			});
			var t = this;
			// 长参数解析
			if (options.scene) {
				let longUrl = decodeURIComponent(options.scene);
				let paramsArray = longUrl.replace("longUrl=", "").split("-");
				options.mid = paramsArray[0];
				options.pid = paramsArray[1];
				options.ac_id = paramsArray[2];
				options.uid = paramsArray[3];
			}

			options.sid ? t.setData({
				imgPath: this.userInfo.user_avatar,
				user_nickname: this.userInfo.user_nickname,
				mid: options.mid,
				uid: options.sid,
				participantId: this.userInfo.user_id,
				pid: options.pid,
			}) : t.setData({
				imgPath: this.userInfo.user_avatar,
				user_nickname: this.userInfo.user_nickname,
				mid: options.mid,
				uid: options.uid || this.userInfo.user_id,
				participantId: this.userInfo.user_id,
				pid: options.pid,
			});

			this.forceUserInfo(function(user) {
				t.GetOtherCutPriceActivityList();
			})
			//t.getTime()
			this.getPlantformInfo(function(plantformInfo) {
				t.poster.views[0].src = plantformInfo.product_poster_bg;
				t.setData({
					//b2bFlag: plantformInfo.b2b_flag
				})
			});
			this.notice.addNotification("RefreshFG", t.refreshGb, t)
		},
		onShow: function() {
			this.GetVendorCutPriceEventDetail()
		},
		onBackPress() {
			// #ifdef APP-PLUS
			if (this.$refs.shareBoxApp.showBoxView) {
				this.$refs.shareBoxApp.cancel();
				return true;
			}
			// #endif

			// #ifdef MP-WEIXIN
			if (this.$refs.shareBoxMp.showBoxView) {
				this.$refs.shareBoxMp.cancel();
				return true;
			}
			// #endif
		},
		onUnload() {
			// 离开页面，注销事件
			var that = this
			this.notice.removeNotification("RefreshFG", that);

			// #ifdef APP-PLUS
			if (this.$refs.shareBoxApp.showBoxView) {
				this.$refs.shareBoxApp.cancel();
			}
			// #endif

			// #ifdef MP-WEIXIN
			if (this.$refs.shareBoxMp.showBoxView) {
				this.$refs.shareBoxMp.cancel();
			}
			// #endif
		},
		onShareAppMessage: function() {
			// #ifdef MP-WEIXIN
			wx.showShareMenu({
				withShareTicket: true,
				menus: ['shareAppMessage', 'shareTimeline']
			});
			// #endif

			var e = this.Info.ac_sale_price - this.Info.ac_mix_limit_price,
				t = e > 0 ? this.$.sprintf(this.__("【砍价】 %s 邀请您帮忙砍一刀！"), this.Info.user_nickname) : this.$.sprintf(this.__("%s 砍价成功！他已节省 %.2f 元！赶快来砍价吧!"), this.Info.user_nickname, (this.Info.activity_rule_json.cutprice.total_price - this.Info.ac_sale_price).toFixed(2));

			let path = this.$.sprintf('/activity/cutprice/detail?mid=%d&pid=%d&ac_id=%d&uid=%d', this.mid, this.pid, this.ac_id, this.uid);

			return {
				imageUrl: this.Info.activity_rule_json.cutprice.cutprice_image,
				title: t,
				path: path
			}
		},
		/**
		 * 用户点击右上角分享朋友圈
		 */
		onShareTimeline: function() {
			var e = this.Info.ac_sale_price - this.Info.ac_mix_limit_price,
				t = e > 0 ? this.$.sprintf(this.__("【砍价】 %s 邀请您帮忙砍一刀！"), this.Info.user_nickname) : this.$.sprintf(this.__("%s 砍价成功！他已节省 %.2f 元！赶快来砍价吧!"), this.Info.user_nickname, (this.Info.activity_rule_json.cutprice.total_price - this.Info.ac_sale_price).toFixed(2));

			let path = this.$.sprintf('/activity/cutprice/detail?mid=%d&pid=%d&ac_id=%d&uid=%d', this.mid, this.pid, this.ac_id, this.uid);


			return {
				title: t,
				query: {
					mid: this.mid,
					ac_id: this.ac_id,
					uid: this.uid,
					pid: this.pid
				},
				imageUrl: this.Info.activity_rule_json.cutprice.cutprice_image,
			}
		},
		methods: {
			...mapMutations(['login', 'logout', 'getPlantformInfo', 'forceUserInfo', 'getUserInfo']),

			GetVendorCutPriceEventDetail: function() {
				var that = this,
					params = {
						activity_id: this.mid,
						user_id: this.uid,
						participant_id: this.userInfo.user_id
					};
				params.user_id == params.participant_id ? this.setData({
					istrue: !0
				}) : this.setData({
					istrue: !1
				});
				$.request({
					url: this.Config.URL.marketing.getCutpriceActivity,
					data: params,
					success: function(data, status, msg, code) {
						if (200 == status) {
							data.CutPricePercent = (data.activity_rule_json.cutprice.total_price - data.ac_sale_price) / (data.activity_rule_json.cutprice.total_price -
								data.activity_rule_json.cutprice.cut_down_min_limit_price)
							that.setData({
								Info: data,
								user_nickname: data.user_nickname,
								imgPath: data.user_avatar,
								ac_id: data.ac_id,
								width: 100 * parseFloat(data.CutPricePercent).toFixed(2)
							});
							that.getTime();
							data.ac_sale_price - data.ac_mix_limit_price <= 0 ? that.setData({
								isCut: !1
							}) : "";

							//WxParse.wxParse("PromotionRule", "html", data.activity_rule.activity_intro, that)

							if (data.activity_remark) {
								that.htmlString = data.activity_rule.activity_intro.replace(/\\/g, "").replace(/<img/g,
									"<img style=\"display:none;\"");
							}
							that.poster.views[1].src = data.activity_rule_json.cutprice.cutprice_image
							that.poster.views[2].text = data.ac_sale_price - data.ac_mix_limit_price > 0 ? that.$.sprintf(that.__("【砍价】 %s 邀请您帮忙砍一刀！"), data.user_nickname) : that.$.sprintf(that.__("%s 砍价成功！他已节省 %.2f 元！赶快来砍价吧!"), data.user_nickname, (data.activity_rule_json.cutprice.total_price - data.ac_sale_price).toFixed(2));
							that.poster.views[3].text = that.$.sprintf(that.__("砍价底价 ¥%.2f"), data.ac_mix_limit_price);
							that.poster.views[4].text = that.Config.SiteUrl + "/h5/activity/cutprice/detail?mid=" + that.mid + "&pid=" + that.pid + "&ac_id=" + that.ac_id + "&uid=" + that.uid;
						} else {
							that.setData({
								flag: !1,
								ispage: !0
							})
							that.$.confirm(msg, that.$.navigateBack);
						}
					}
				});
			},
			//生成的海报图片
			createPoster(e) {
				this.productPoster = e
				if (this.productPoster) {
					uni.hideLoading();
					this.$refs.shareBoxMp.path = this.productPoster;
				}
			},
			getTime: function() {
				var e = this,
					t = (new Date).getTime(),
					s = this.Info.activity_endtime,
					n = this.Info.activity_starttime;
				var i = n,
					u = s;
				if (i >= t) {
					var a = setInterval(function() {
						e.setData({
							Time: $.Formattime1(e.Info.activity_starttime, a),
							end: 1
						}), e.Time == undefined && e.getTime()
					}, 1e3);
					return
				}
				if (u <= t) {
					var a = setInterval(function() {
						e.setData({
							Time: $.Formattime2(e.Info.activity_endtime, a),
							end: 3
						}), e.Time == undefined && e.getTime()
					}, 1e3);
					return
				}
				if (i < t < u) {
					var a = setInterval(function() {
						e.setData({
							Time: $.Formattime2(e.Info.activity_endtime, a),
							end: 2
						}), e.Time == undefined && e.getTime()
					}, 1e3);
					return
				}
			},
			GetOtherCutPriceActivityList: function() {
				var params = {
						activity_id: this.mid,
						user_id: this.uid,
						page: this.page
					},
					t = this;

				$.request({
					url: this.Config.URL.marketing.listsCutpriceHistory,
					data: params,
					success: function(data, status, msg, code) {
						if (200 == status && data.items.length > 0) {
							t.setData({
								flag: !1
							});
							t.setData({
								ispage: !0,
								List: data.items
							});
						} else {
							t.setData({
								flag: !1,
								ispage: !0
							})
						}
					}
				});
			},
			scrollbottom: function() {
				var e = this;
				e.setData({
					flag: !1
				}), clearTimeout(t);
				var t = setTimeout(function() {
						e.setData({
							type: e.type,
							page: parseInt(e.page) + 1,
							rows: 10
						}), e.GetOtherCutPriceActivityList()
					},
					500)
			},
			CutPrice: function() {

				if (this.Info.activity_state > 1) {
					this.$.alert(this.__('活动已结束！'))
					return;
				}
				var params = {
						ac_id: this.ac_id,
						user_id: this.userInfo.user_id
					},
					that = this;
				$.request({
					url: this.Config.URL.marketing.doCutprice,
					data: params,
					method: "POST",
					success: function(data, status, msg, code) {
						if (200 == status) {
							that.setData({
								money: data.ach_price,
								ac_id: data.ac_id,
								showImg: true
							})
							that.GetVendorCutPriceEventDetail();
							that.GetOtherCutPriceActivityList();
						} else {
							that.$.alert(msg)
						}
					}
				});

			},

			bargin: function() {
				this.CutPrice()
			},
			back: function() {
				this.setData({
					showImg: false
				}), this.GetVendorCutPriceEventDetail(), this.GetOtherCutPriceActivityList()
			},
			more: function(e) {
				if (this.flag) {
					var t = this;
					clearTimeout(n);
					var n = setTimeout(function() {
						t.setData({
							page: parseInt(t.page) + 1
						}), t.GetOtherCutPriceActivityList()
					}, 500)
				}
			},
			goshop: function() {
				var e = this,
					params = {
						amount: 1,
						items: this.Info.activity_rule_json.cutprice.items,
						ac_id: this.Info.ac_id,
						order_id: this.Info.order_id,
						ac_id: this.ac_id
					};
				if (this.Info.order_id == "") {
					let items = params.items;
					let item_id_str = "";
					for (var i = 0; i < items.length; i++) {
						if (item_id_str == "") {
							item_id_str = items[i].item_id + "|" + items[i].num + "|" + 0
						} else {
							item_id_str = item_id_str + items[i].item_id + "|" + items[i].num + "|" + 0
						}

						if (i != items.length - 1) {
							item_id_str = item_id_str + ","
						}
					}

					if (items.length > 0) {
						$.navigateTo({
							url: "/pagesub/checkout/checkout?single_activity=1&ifcart=0&cart_id=" + item_id_str +
								"&activity_id=" + this.mid + "&ac_id=" + this.ac_id
						})
					} else {
						$.navigateTo({
							url: "/pages/checkout/checkout?single_activity=1&ifcart=0&cart_id=" + item_id_str +
								"&activity_id=" + this.mid + "&ac_id=" + this.ac_id
						})
					}

				} else {
					// $.navigateTo({url: "/pages/checkout/checkout?spid=" + JSON.stringify(params) + "&activity_id=" + this.mid + "&sponsorId=" + this.uid + "&sp=" + this.Info.ServicePlaceCode + "&pm=" + this.Info.PayMethodCode + "&et=" + this.Info.BusinessHoursEnd + "&st=" + this.Info.BusinessHoursStart + "&showdate=" + this.Info.ReservationTimeEnabled + "&showname=" + this.Info.ContactEnabled})
				}
			},
			shareQRCode: function(e) {
				let that = this;
				if (this.productPoster == '') {
					uni.showLoading({
						title: '海报生成中..',
						mask: true
					});

					// #ifdef MP-WEIXIN
					let path = that.$.sprintf('%s/h5/activity/cutprice/detail?mid=%d&pid=%d&ac_id=%d&uid=%d', that.Config.SiteUrl,
						this.mid, this.pid, this.ac_id, this.uid);
					that.$.request({
						url: that.Config.URL.fx.poster,
						data: {
							user_id: that.userInfo.user_id,
							path: path,
							width: 430,
							poster_type: 2
						},
						success: function(data, status, msg, code) {
							if (200 == status) {
								let qrcode_url = data.qrcode;

								if (data.qrcode.indexOf("?") != -1) {
									qrcode_url = data.qrcode + '&rand=' + Math.random()
								} else {
									qrcode_url = data.qrcode + '?rand=' + Math.random()
								}

								that.poster.views[4].type = 'image';
								that.poster.views[4].src = qrcode_url;
								that.$refs.painter.render(that.poster);
							} else {

							}
						}
					});
					// #endif

					// #ifdef H5
					that.$refs.painter.render(this.poster);
					// #endif

				}
			},
			shareBox: function() {
				let that = this;
				// 如允许点击超链接跳转，则应该打开一个新页面，并传入href，由新页面内嵌webview组件负责显示该链接内容
				var $href = $.sprintf('%s/h5/activity/cutprice/detail?mid=%d&pid=%d&ac_id=%d&uid=%d', that.Config.SiteUrl,
					this.mid, this.pid, this.ac_id, this.uid);
				// 如允许点击超链接跳转，则应该打开一个新页面，并传入href，由新页面内嵌webview组件负责显示该链接内容
				// #ifdef APP-PLUS
				$href = $.sprintf('%s/h5/activity/cutprice/detail?mid=%d&pid=%d&ac_id=%d&uid=%d', that.Config.SiteUrl,
					this.mid, this.pid, this.ac_id, this.uid);
				// #endif

				// #ifdef MP-WEIXIN
				$href = $.sprintf("%s/activity/cutprice/detail?mid=%d&pid=%d&ac_id=%d&uid=%d", that.Config.SiteUrl,
					this.mid, this.pid, this.ac_id, this.uid);
				// #endif

				this.setData({
					shareData: {
						shareTitle: this.Info.activity_title,
						shareText: '',
						href: $href,
						image: this.Info.activity_rule_json.cutprice.cutprice_image,
						price: this.Info.activity_rule_json.cutprice.total_price,
					}
				});

				// #ifdef APP-PLUS
				this.$refs.shareBoxApp.show();
				// #endif

				// #ifdef MP-WEIXIN
				this.$refs.shareBoxMp.show();
				// #endif


				// #ifdef H5
				if (that.$.ifUniApp()) {
					this.$refs.shareBoxH5.show();
				} else {
					this.$refs.shareBoxMp.show();
				}
				// #endif

				return;

				this.setData({
					PageQRCodeInfo: {
						Path: "",
						IsShare: !0,
						IsShareBox: !0,
						IsJT: !1
					}
				})
			},
			cancelShare: function() {
				this.setData({
					PageQRCodeInfo: {
						Path: "",
						IsShare: !1,
						IsShareBox: !1,
						IsJT: !1
					}
				})
			},
			saveImg: function() {
				var e = this;
				$.showLoading(), $.downloadFile({
					url: this.PageQRCodeInfo.Path,
					success: function(t) {
						$.hideLoading(), $.saveImageToPhotosAlbum({
							filePath: t.tempFilePath,
							success: function() {
								e.setData({
									PageQRCodeInfo: {
										Path: "",
										IsShare: !1,
										IsShareBox: !1,
										IsJT: !1
									}
								}), $.alert("保存图片成功！")
							},
							fail: function(e) {
								$.hideLoading();
							}
						})
					},
					fail: function(e) {
						$.hideLoading()
					}
				})
			},
			showCodeImg: function() {
				$.previewImage({
					current: this.PageQRCodeInfo.Path,
					urls: [this.PageQRCodeInfo.Path]
				})
			}
		}
	}
</script>

<style lang="scss">
	@import "../../styles/_variables";

	.u-tap-btn {
		position: fixed;
		right: 20upx;
		bottom: 150upx;
	}

	.u-go-home {
		border-radius: 100%;
		width: 80upx;
		height: 80upx;
		border: 1px solid #eee;
		font-size: 20upx;
		text-align: center;
		background-color: #fff;
		box-shadow: 0px 4upx 8upx rgba(0, 0, 0, 0.35);
		z-index: 2;
		opacity: 0.8;
		line-height: 80upx;
		margin-bottom: 20upx;
	}

	.u-go-home .iconfont {
		font-size: 40upx;
	}

	.bargin {
		width: 750upx;
		// background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/whole-background-start.png);
		// background-repeat: no-repeat;
		// background-size: 100% 100%;
		// -moz-background-size: 100% 100%;
	}

	.goods-back-sty {
		background-color: #fff;
		margin-left: 80upx;
		margin-right: 80upx;
		padding-bottom: 1upx;
	}

	.part1_product {
		display: flex;
		background-color: #eceeff;
		border-radius: 10upx;
		margin-bottom: 10upx;
	}

	.pro_img {
		margin-top: 20upx;
		margin-left: 10upx;
		width: 215upx;
		height: 205upx;
		border-radius: 15upx;
		border: 6upx solid mediumpurple;
		/* 添加紫色 1px 边框 */
	}

	.pro_info {
		margin-top: 50upx;
		margin-left: 20upx;
		position: relative;
		padding-right: 70upx;
	}

	.item_name_sty {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: normal;
	}

	.price_sty {
		position: absolute;
		left: 1upx;
		bottom: 10upx;
		width: 300upx;
	}

	.part-bottom-sty {
		margin-top: -2upx;
		width: 750upx;
		height: 1200upx;
		background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/background-bottom-one.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-moz-background-size: 100% 100%;
	}

	.goods {
		padding-left: 60upx;
		padding-top: 90upx;
	}

	.wxParse-p {
		padding: 0 40upx;
	}

	.remaining {
		padding-left: 340upx;
		padding-top: 18upx;
		font-size: 28upx;
		color: #fff;
		font-weight: bold;
	}

	.time_sty {
		height: 125upx;
		margin-left: 90upx;
		margin-right: 90upx;
		padding-left: 150upx;
	}

	.time_fon_sty {
		margin-left: 65upx;
		font-weight: bold;
	}

	.remaining_time {
		font-size: 45upx;
		color: white;
	}

	.time {
		margin-right: 10upx;
		padding-left: 10upx;
		padding-right: 10upx;
		padding-top: 6upx;
		padding-bottom: 4upx;
		display: inline;
		background-size: 80% 80%;
		background-color: #5555ff;
		border-radius: 8upx;
		text-align: center;
	}

	.point_sty {
		color: #5555ff;
		display: inline;
		margin-right: 10upx;
	}

	.present {
		padding-left: 340upx;
		padding-top: 10upx;
	}

	.present_price {
		display: inline;
		font-size: 28upx;
		color: #fff;
	}

	.price {
		display: inline;
		font-size: 32upx;
		color: #fff;
	}

	.top-sty {
		width: 750upx;
		height: 950upx;
		background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/background-start-top.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-moz-background-size: 100% 100%;
	}

	.user-info {
		padding-top: 690upx;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}

	.user-img {
		width: 180upx;
		height: 180upx;
		border-radius: 50%;
		border: 8upx solid mediumpurple;
	}

	.username {
		margin-top: 5px;
		font-size: 28upx;
		font-weight: bold;
		color: mediumpurple;
	}

	.goods-sty {
		margin-top: -2upx;
		width: 750upx;
		background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/background-goods.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-moz-background-size: 100% 100%;
	}

	// .part2 {
	// 	margin-top: 45upx;
	// 	margin-left: 58upx;
	// 	margin-right: 62upx;
	// 	border: 1upx solid rgb(201, 76, 98);
	// 	background: rgb(176, 14, 46);
	// 	border-radius: 30upx;
	// 	height: 146upx;
	// 	display: flex;
	// 	justify-content: space-between;
	// 	align-items: center;
	// 	padding: 0 10upx;
	// }

	.text1 {
		font-size: 28upx;
		color: #fff;
		margin-top: 6upx;
	}

	.progress-bar {
		margin-top: 36upx;
		margin-left: 64upx;
		margin-right: 30upx;
		width: 618upx;
		height: 36upx;
		border: 5upx solid rgb(89, 10, 35);
		background: rgb(89, 10, 35);
		border-radius: 40upx;
		position: relative;
	}

	.left {
		border-radius: 40upx;
		background: rgb(255, 231, 0);
		height: 100%;
		float: left;
	}

	.m-nearbylist {
		height: 100%;
	}

	.original {
		color: #fff;
		float: left;
	}

	.og1 {
		padding-left: 80upx;
		padding-top: 15upx;
		font-size: 28upx;
	}

	.og2 {
		padding-left: 75upx;
		font-weight: bolder;
		padding-top: 6upx;
		color: #ffc001;
		font-family: '微软雅黑';
		font-size: 32upx;
	}

	.part3 {
		position: relative;
		height: 210upx;
	}

	.cut-off {
		color: #fff;
		display: flex;
		flex-flow: column;
		justify-content: center;
		margin-right: 72upx;
		text-align: right;
	}

	.button-start {
		margin-top: 20upx;
		margin-left: 270upx;
		margin-right: 270upx;
		height: 70upx;
		line-height: 70upx;
		text-align: center;
		background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/begin-bargaining-button.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-moz-background-size: 100% 100%;
	}

	.cut_down_sty {
		margin-bottom: 10upx;
		justify-content: space-between;
		display: flex;
		font-size: 28upx;
		font-weight: bold;
		color: mediumpurple;
	}

	.immediately_btn {
		margin-left: 180upx;
		height: 60upx;
		width: 150upx;
		background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/sell-immediately.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-moz-background-size: 100% 100%;
	}

	.help_cut_btn {
		margin-left: 100upx;
		height: 60upx;
		width: 150upx;
		background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/help-cut.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-moz-background-size: 100% 100%;
	}

	.cut_pri_sty {
		position: absolute;
		right: 180upx;
		height: 60upx;
		width: 150upx;
		background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/help-cut-price.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-moz-background-size: 100% 100%;
	}

	.up_hands_sty {
		position: absolute;
		left: 180upx;
		height: 60upx;
		width: 150upx;
		background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/sell-immediately.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-moz-background-size: 100% 100%;
	}

	.i_want_sty {
		position: absolute;
		left: 180upx;
		height: 60upx;
		width: 150upx;
		background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/i-want.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-moz-background-size: 100% 100%;
	}

	.help_cut_btn_1 {
		position: absolute;
		right: 180upx;
		height: 60upx;
		width: 150upx;
		background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/help-cut.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-moz-background-size: 100% 100%;
	}

	.again_stroll_sty {
		position: absolute;
		left: 300upx;
		height: 60upx;
		width: 150upx;
		background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/again-stroll.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-moz-background-size: 100% 100%;
	}

	.congratulate-success {
		position: absolute;
		left: 300upx;
		height: 60upx;
		width: 150upx;
		background-image: url(https://static.shopsuite.cn/xcxfile/appicon/cutprice-1/sell-immediately.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-moz-background-size: 100% 100%;
	}

	.button {
		margin-top: 40upx;
		margin-left: 160upx;
		margin-right: 160upx;
		border: 1upx solid rgb(255, 172, 51);
		background: rgb(255, 172, 51);
		border-radius: 12upx;
		height: 70upx;
		line-height: 70upx;
		text-align: center;
		color: #fff;
		font-size: 32upx;
	}

	.button1 {
		width: 240upx;
		height: 70upx;
		font-size: 32upx;
		margin-top: 40upx;
		color: #fff;
		text-align: center;
		line-height: 70upx;
		border-radius: 12upx;
		background: rgb(255, 172, 51);
	}

	.button2 {
		margin-top: 40upx;
		margin-left: 160upx;
		margin-right: 160upx;
		background: rgb(136, 136, 136);
		border-radius: 12upx;
		height: 70upx;
		line-height: 70upx;
		text-align: center;
		color: #fff;
		font-size: 32upx;
	}

	.part4 {
		color: #fff;
		border-top: 2upx solid rgb(140, 19, 55);
		margin-top: 63upx;
		min-height: 360upx;
	}

	.header {
		padding-top: 36upx;
		text-align: center;
		font-size: 32upx;
		margin-bottom: 10upx;
	}

	.content {
		text-indent: 3em;
		padding-top: 22upx;
		font-size: 28upx;
	}

	.content1 {
		text-indent: 3em;
		padding-top: 20upx;
		font-size: 28upx;
	}

	.part5 {
		margin-top: 40upx;
	}

	.header1 {
		text-align: center;
		font-size: 32upx;
		color: #fff;
		background: rgb(255, 172, 51);
		border-radius: 42upx;
		height: 52upx;
		line-height: 52upx;
	}

	.header_shadow {
		margin-left: 222upx;
		margin-right: 233upx;
		border-radius: 42upx;
		height: 52upx;
		line-height: 52upx;
		padding-bottom: 4upx;
	}

	.part6 {
		margin-top: 110upx;
		height: 630upx;
		margin-left: 80upx;
		margin-right: 80upx;
		overflow: hidden;
	}

	.avatar_sty {
		margin-top: 20upx;
		margin-left: 20upx;
		width: 120upx;
		height: 120upx;
		border-radius: 50%;
		border: 3upx solid mediumpurple;
	}

	.user_nickname_sty {
		margin-top: 30upx;
		margin-left: 15upx;
		font-size: 32upx;
		width: 280upx;
		height: 55upx;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.cut_away_sty {
		color: #0543d5;
		font-size: 32upx;
		position: absolute;
		right: 5upx;
		top: 50upx;
		font-weight: bold;
		font-size: 28upx;
	}

	.kanjia view {
		font-size: 28upx;
		color: #fff;
	}

	.animation {
		width: 100%;
		height: 100%;
		// background: black;
		position: absolute;
		top: 0;
	}

	.dao {
		width: 380upx;
		height: 340upx;
		position: absolute;
		top: 4%;
		right: 0%;
	}

	.dao1 {
		width: 380upx;
		height: 340upx;
		position: absolute;
		top: 4%;
		right: 0%;
		animation: move 300ms linear;
		animation-delay: 500ms;
		transform-origin: right bottom;
		animation-fill-mode: forwards;
	}

	@keyframes move {
		0% {
			transform: rotateX(0);
		}

		50% {
			transform: rotateZ(-45deg);
		}

		100% {
			transform: rotateZ(-30deg);
		}
	}

	.bag {
		width: 336upx;
		height: 344upx;
		position: absolute;
		top: 32%;
		left: 25%;
	}

	.bagmoney {
		width: 525upx;
		height: 516upx;
		position: absolute;
		top: 24%;
		left: 21%;
	}

	.success {
		width: 60%;
		height: 66upx;
		border-radius: 10upx;
		background: rgb(250, 51, 1);
		line-height: 66upx;
		text-align: center;
		position: absolute;
		bottom: 15%;
		left: 20%;
		color: #fff;
	}

	.Price {
		display: inline;
		font-size: 42upx;
		position: absolute;
		top: 67%;
		width: 100%;
		// #ifdef MP-WEIXIN
		top: 62% !important;
		// #endif
		text-align: center;
		color: rgb(255, 227, 130);
	}

	.more {
		color: #fff;
		font-size: 28upx;
		display: flex;
		justify-content: center;
		background: rgb(41, 36, 56);
		padding-bottom: 40upx;
	}

	/* .progressBarBox{position: absolute;right: 0;bottom: 38%;color: #888;font-size: 24upx;margin-right: 20upx;} */

	.u-progressBar {
		display: inline-block;
		width: 80%;
		height: 26upx;
		background-color: #d5d5d5;
		border-radius: 20upx;
		overflow: hidden;
		margin-left: 10%;
	}

	.u-progressBar-cont {
		height: 26upx;
		background-color: mediumpurple;
	}

	.floor {
		color: #ffc001;
		font-size: 28upx;
		padding-top: 10upx;
	}
</style>